
import './App.css';
// 定义一级路由坑 用来显示对应的页面
import Rules from '@/router/index';
function App() {
  return (
    <div className="App">
      {/* 路由规则及坑 */}
      <Rules></Rules>
    </div>
  );
}

export default App;

// vue 框架和react 框架的区别
// 相同点: 都是单页面应用框架
// 不同点:
// vue 有大量的语法糖 如指令 修饰符 ... 方便开发者开发
// 每个组件都有自己的 标签结构, js , css  
// react :语法更加接近原生语法 :class 类函数 等等 
// react 函数组件和类组件

// vue 响应式原理
// vue 使用 object.defineProperty() 通过该方法给多有的data 中的数据绑定get set ,监听对应的数据变化,实现响应式
// react 使用 setState 方法修改数据,这样然后坚挺到数据的变化后,再操作页面

// 父传子方式上
// vue 可以在子组件上修改父组件传过来的props 数据,父组件上的数据就改变了 ,影响其他组件 ,数据流是双向的
// react  不可以修改父组件传递给子组件的参数 ,因为react 中数据的传递是单向的 

// 路由
// vue 通过配置文件中定义路由规则,然后将路由规则传递给路由实例对象,并绑定到根实例,实现全局路由
// vue 每一层级组件只有一个公共的router-view 坑
// react 路由一切皆组件的思想,没有 配置文件,只有组件,将配置规则写在 Route组件的属性上
// react 一个规则对应一个坑 

// 全局状态管理 vuex 和redux 区别
// vuex 的全局 挂载到根实例上,每个组件可以直接访问,并修改
// redux  包裹根组件,每个组件可以访问, 默认需要导入store, 并且 重新订阅  (借助react-redux解决的问题)



